<template>
	<view class="content">
		<view class="info">
			<view class="infoTop">
				<view class="infoLine">
					<text class="infoTitle">教师号码：</text>
					<text class="infoValue">{{ dataInfo.TeacherDataID }}</text>
					<uni-icons type="arrowright" size="20" color="#ffffff"></uni-icons>
				</view>
				<view class="infoLine">
					<text class="infoTitle">教师姓名：</text>
					<text class="infoValue">{{ dataInfo.TeacherName }}</text>
					<uni-icons type="arrowright" size="20" color="#ffffff"></uni-icons>
				</view>
				<view class="infoLine">
					<text class="infoTitle">教师性别：</text>
					<text class="infoValue">{{ dataInfo.TeacherSex+'　' }}</text>
					<uni-icons type="arrowright" size="20" color="#ffffff"></uni-icons>
				</view>
			</view>
		</view>
		<view class="bottom" @click="onLogout">
			<text style="width: 100%;">退出登录</text>
		</view>
	</view>
</template>

<script>
// 引入API
import { getTeacherInfo } from '@/api/teacher.js';
export default {
	data() {
		return {
			dataInfo: {
				
			},
			id: '',
		};
	},
	onLoad(option) {
		
	},
	onReady() {
		this.getTeacherInfo();
	},
	methods: {
		getTeacherInfo() {
			getTeacherInfo().then(res => {
				if (res.data.code == 0) {
					this.dataInfo = res.data.data;
				} else {
					uni.showToast({
						title: res.data.msg,
						icon: 'none'
					});
				}
			});
		},

		onLogout() {
			uni.showModal({
			    title: '确认',
			    content: '确认要退出登录吗？',
			    success: res => {
					if (res.confirm) {
						uni.clearStorage();
						uni.navigateTo({
							url: '../login/login'
						})
					}
				}
			});
		}
	}
};
</script>

<style>
page {
	background-color: #f5f5f5;
}
.content {
	padding-bottom: 170rpx;
}
.title {
	display: flex;
	background-color: #ffffff;
	padding: 20rpx 10rpx;
	align-items: center;
}
.title .icon {
	padding: 0 20rpx;
}
.info {
	width: 100%;
	height: 100%;
	background-color: #ffffff;
	margin-top: 10rpx;
	align-items: center;
	box-sizing: border-box;
	padding: 0 10rpx;
	padding: 20rpx;
}
.infoLine {
	display: flex;
	height: 30rpx;
	align-items: center;
	justify-content: flex-start;
	padding: 20rpx 0;
}
.info .infoTitle {
	color: #888888;
	width: 25%;
}
.info .infoValue {
	width: 75%;
	word-wrap: break-word;
}
.info .infoNote{
	margin-top: -50rpx;
	margin-left: 140rpx;
}
.bottom {
	width: 100%;
	background-image: linear-gradient( #60A0D4, #60A0D4);
	color: #FFFFFF;
	text-align: center;
	display: flex;
	padding: 20rpx 10rpx;
	box-sizing: border-box;
	border-radius: 3px;
	margin-top: 50rpx;
	flex-direction: row; 
	justify-content: center;
}
</style>
